<template>
    <div class="container">
        <div @click="baocun">保存</div>
        <div v-drag v-for="item in list" :style="{
            top: item.y + 'px',
            left: item.x + 'px',
        }" :key="item.id" @click="aaa(item)">
            {{ item.name }}</div>

    </div>
</template>
<script>
export default {
    name: '',
    data() {
        return {
            list: [
                { id: 1, x: 30, y: 30, name: '一通道' },

            ]
        }
    },
    mounted() {

    },
    methods: {
        aaa(a) {
            console.log(a);
        },
        baocun() {
            console.log(this.list);
        }
    },

}
</script>
<style lang="less" scoped>
.container {
    width: 100%;
    height: 500px;
    background-color: white;
    position: relative;
}

div {
    width: 100px;
    height: 100px;
    background-color: saddlebrown;
    position: absolute;
    left: 0;
    top: 0;
}
</style>
